<template>
	<view class="order">
		<u-navbar :titleStyle="{fontWeight:'bold'}" title="我的订单" />
		<view class="order-tabs">
			<u-tabsw :active-item-style="{color:'#000'}" :list="list" allBold active-color="#FFCF4F"
				inactive-color="#666666" :current="current" @change="change"></u-tabsw>
		</view>
		<view class="order-list">
			<order-item @confirmChang="confirmChang" @cancelChang="cancelChang" @payChang="paysChang" :index="index" v-for="(item,index) in order_list" :key="item.id" :item="item"/>
			<listempty mode="order" vh="300px" text="暂无订单记录" :list="order_list" />
		</view>
		<comonpay ref="pay" @payEvnet="payEvnet" />
	</view>
</template>

<script>
	// var plugin = requirePlugin("logisticsPlugin")
	export default {
		data() {
			return {
				list:[
					{
						name:'全部',
						activeState:'all'
					},
					{
						name:'待支付',
						activeState:'wait_pay'
					},
					{
						name:'待发货',
						activeState:'send'
					},
					{
						name:'已发货',
						activeState:'receive'
					},
					{
						name:'已取消',
						activeState:'cancel'
					},
					{
						name:'已完成',
						activeState:'completed'
					},
					{
						name:'退款/售后',
						activeState:'refund'
					}
				],
				current:0,
				page:1,
				limit:8,
				order_list:[],
				total_page:'',
				order_data:{}
			};
		},
		onLoad(e){
			if(!this.vuex_token){
				uni.$u.toast('请先登录')
				setTimeout(()=>{
					uni.navigateTo({
						url:'/subpkg/login/login'
					})
				},800)
				return
			}
			this.current = e.index||0
			this.getOredeList()
		},
		onShow(){
			if(Object.keys(this.evalua_data).length != 0&&this.evaluate_switch){
				let obj  = this.order_list[this.evalua_data.index].goods_list.find(item=> item.id == this.evalua_data.id)
				obj.comment_state = 2
				this.$u.vuex('evalua_data',{})
				this.$u.vuex('evaluate_switch',false)
			}
		},
		onReachBottom(){
			if(!this.dropdown(this.page,this.total_page)){
				this.page++
				this.getOredeList()
			}
		},
		methods:{
			// plugin.openWaybillTracking({
			// 	waybillToken: waybill_token
			// });
			confirmChang(e){
				this.setupOrder(e.id,'confirm')
			},
			cancelChang(e){
				this.setupOrder(e.id,'cancel')
			},
			payEvnet(e){
				if(e=='success'){
					this.setupOrder(this.order_data.id,'pay')
				}
			},
			setupOrder(e,type){
				let data = this.order_list.find(item=> item.id == e)
				if(type == 'pay'){
					data.is_pay = 1
					data.status_name = '待发货'
				}else if(type == 'cancel'){
					data.status = 2
					data.status_name = '已取消'
				}else if(type == 'confirm'){
					data.status = 3
					data.status_name = '已完成'
				}
			},
			paysChang(e){
				const {info,item } = e
				this.order_data = item
				this.$refs.pay.payChang(info)
			},
			getOredeList(){
				this.showLoding()
				this.$network('/api/order/lists',{
					page:this.page,
					limit:this.limit,
					activeState:this.list[this.current].activeState
				}).then(res=>{
					const { list ,total_page} = res.data
					if(this.page != 1){
						this.order_list = [...this.order_list,...list]
					}else{
						this.order_list = list
					}
					this.total_page = total_page
					this.$nextTick(()=>{
						this.showhideloding()
					})
				})
			},
			change(e){
				this.current = e
				this.page = 1
				this.getOredeList()
			}
		}
	}
</script>

<style lang="scss">
	page{
		background: #f5f5f5;
	}
	.order-tabs{
		background: #FFF;
	}
.order-list{
	padding: 0 20rpx;
}
</style>
